// 引入vue和router
import Vue from 'vue'
import Router from 'vue-router'

import HelloWorld from '@/components/HelloWorld'
import day06 from '@/components/day06'
import notFound from '@/components/404'
import eat from '@/components/Eat'
import taoyuan from '@/components/taoyuanjieyi'
import index from '@/components/day06index'
import child1 from '@/components/day06child1'
import child2 from '@/components/day06child2'
import child3 from '@/components/day06child3'
const list = () => import('@/components/day06list')
import detail from '@/components/day06detail'
// const Foo = () => import('./Foo.vue')

// 使用中间件
Vue.use(Router)

// 通过$router.push()方法，导航到当前页面时会报错。加上这个就好，捕获错误
const originalPush = Router.prototype.push;
Router.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}

export default new Router({
  // 改成history模式。这是前端需要改的代码。后端也要调整
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld,
      meta: {
        title: '首页'
      }
    },
    {
      path: '/day06',
      name: 'day06',
      component: day06,
      meta: {
        title: 'day06'
      },
      // 路由独享守卫，只管这一个，别的不管
      beforeEnter: (to, from, next) => {
        console.log('day06-路由独享守卫');
        next()
      }
    },
    {
      path: '/eat',
      name: 'eat',
      component: eat,
      meta: {
        title: '吃！'
      }
    },
    {
      path: '/taoyuan',
      name: 'jieyi',
      component: taoyuan
    },
    {
      // 嵌套路由在此！！！！
      // 嵌套路由在此！！！！
      // 嵌套路由在此！！！！
      path: '/index',
      name: 'index',
      component: index,
      // children里面都是index的子路由
      children: [
        // #/index/child1
        {path: 'child1', component: child1},
        // #/index/
        {path: '', component: child2},
        // #/index/child3
        {path: 'child3', component: child3},
      ]
    },
    // 动态路由在此！
    // 动态路由在此！
    // 动态路由在此！
    // 动态路由第一步，给路由加上变量
      {
        path: '/list',
        component: list
      },
      {
        path: '/detail/:name',
        component: detail
      },
    // {
    //   // 匹配所有路径，优先级比较低，优先匹配更准确的路由
    //   path: '*',
    //   name: 'notFound',
    //   component: notFound
    // }
    {
      // 匹配所有路径，优先级比较低，优先匹配更准确的路由
      path: '*',
      name: 'notFound',
      // 重定向，将错误的地址重定向，换到404去
      redirect: '/404'
    },
    {
      path: '/404',
      name: 'notFound1',
      component: notFound
    },
    {
      path: '/woshicuowudelujing',
      redirect: '/404'
    },
    { 
      // 正经的名字
      path: '/cuowudelujing',
      // 外号
      alias: '/cuowudelujing111',
      component: list
    }
  ]
})
